<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html>
<html lang="zh-cn">
<body>
	<!-- 引入头部 -->
	<jsp:include page="head.jsp"></jsp:include>

	
</div>
	<section class="pro-list">
		<aside class="pro-leftsidebar">
			<ul>
				<li><a>产品搜索</a>
					<ul id="pro-search">
						<li>
							<form action="ChanPinServlet?method=toSearch" method="post">
								<input type="text" name="searchName" class="pro-search"
									style="color: white">
								<button type="submit"
									class="layui-btn layui-btn-xs layui-btn-primary">搜索</button>

							</form>
						</li>
					</ul></li>
				<li><a>产品分类</a>
					<ul id="pro-category">
						<c:forEach items="${type}" var="obj">
							<li><a
								href="ChanPinServlet?method=toDisplay3&productTypeId=${obj.productTypeId }">${obj.typeName }</a></li>
						</c:forEach>
					</ul></li>
			</ul>
		</aside>

		<aside class="pro-rightsidebar">
			<header>
				<p></p>
				<span>椅子系列</span>
				<div class="product-nav">
					<a href="index.jsp">首页 </a>&#62;<a href="ChanPinServlet?method=toDisplay2">产品展示</a>&#62;<a>XX椅子</a>
				</div>
			</header>
			<main>
			<div class="pro-right-left">
				<div class="pro-details-img">
					<c:forEach items="${Productdetails }" var="pro">
									<img src="${pro.proUrl }"  >
									</c:forEach>
							</div>
			

				<div class="pro-detalis-carousel">
					<div class="am-slider am-slider-default am-slider-carousel"
						data-am-flexslider="{itemWidth: 112, itemMargin: 4,move:5,  controlNav: false ,  slideshow: true}">
						<ul class="am-slides pro-details">
							<c:forEach items="${Productdimgs}" var="ban">
								<li><img src="${ban.imgurl}"></li>
							</c:forEach>

						</ul>
					</div>
				</div>

			</div>
			<div class="pro-right-right">
				<ul class="pro-right-info-constant">
					<li>产品名称:</li>
					<li>产品材质:</li>
					<li>产品售价:</li>
					<li>市场价:</li>
				</ul>
				<ul class="pro-right-info-variable">
					<c:forEach items="${Productdetails}" var="tup">
						<li>${tup.name}</li>
						<li>${tup.meterial}</li>
						<li>${tup.dingwei}</li>
						<li>${tup.price}</li>
					</c:forEach>

				</ul>
			</div>

			<div class="am-tabs pro-tabs" data-am-tabs>
				<ul class="am-tabs-nav am-nav am-nav-tabs">
					<li class="am-active"><a href="#tab1">详细说明1</a></li>
					<!-- <li><a href="#tab2">详细说明2</a></li>
					<li><a href="#tab3">详细说明3</a></li>
					<li><a href="#tab4">详细说明4</a></li> -->
				</ul>
				<div class="am-tabs-bd">
					<div class="am-tab-panel am-active" id="tab1">
						<ul>
						
						<c:forEach items="${Productdetails}" var="ba">
								<li><span class="pro-tabs-constant">品牌:</span> <span
								class="pro-tabs-variable">${ba.brand }</span></li>
							<li><span class="pro-tabs-constant">是否组装:</span> <span
								class="pro-tabs-variable">${ba.zuzhuang }</span></li>
							<li><span class="pro-tabs-constant">是否可定制:</span> <span
								class="pro-tabs-variable">${ba.color }</span></li>
							<li><span class="pro-tabs-constant">型号:</span> <span
								class="pro-tabs-variable">${ba.color }</span></li>
							<li><span class="pro-tabs-constant">颜色分类:</span> <span
								class="pro-tabs-variable">${ba.color }</span></li>
							<li><span class="pro-tabs-constant">设计元素:</span> <span
								class="pro-tabs-variable">${ba.stlye }</span></li>
							<li><span class="pro-tabs-constant">风格:</span> <span
								class="pro-tabs-variable">${ba.brand }</span></li>
							<li><span class="pro-tabs-constant">款式定位:</span> <span
								class="pro-tabs-variable">成熟大叔</span></li>
							</c:forEach>
							
						</ul>
					</div>
				</div>
			</div>
			</main>
		</aside>
	</section>
	<!-- 引入脚部 -->
	<jsp:include page="foot.jsp"></jsp:include>
</body>

</html>